<template>
	<view style="padding: 0 72rpx;padding-top: 200rpx;">
		<view style="">
			<u-image src="/static/login/loginLog.svg"
				style="display: flex;flex-direction: row;justify-content: center;margin-left: 7%;" width="85%"
				height="auto" mode="widthFix"></u-image>
		</view>
		<u-input v-model="query.Email" :customStyle="{'padding-left':'10rpx'}" style="margin-top: 150rpx;" :placeholder="$t('login_email')"
			border="bottom" clearable>
			<u-icon slot="prefix" size="25" name="email"></u-icon>
		</u-input>
		<u-input :customStyle="{'padding-left':'10rpx'}" v-model="query.Password" style="margin-top: 100rpx;"
			:placeholder="$t('login_pass')" v-show="passtype" suffixIcon="/static/login/passsee.png" type="password"
			border="bottom">
			<u-icon slot="prefix" size="25" name="lock-open"></u-icon>
			<template slot="suffix">
				<u-icon size="20" width="20" height="10" name="/static/login/passnosee.png" @click="settype"></u-icon>
			</template>
		</u-input>
		<u-input :customStyle="{'padding-left':'10rpx'}" v-model="query.Password" style="margin-top: 100rpx;"
			:placeholder="$t('login_pass')" v-show="!passtype" suffixIcon="/static/login/passsee.png" type="text"
			border="bottom">
			<u-icon slot="prefix" size="25" name="lock-open"></u-icon>
			<template slot="suffix">
				<u-icon size="20" width="22" height="16" name="/static/login/passsee.png" @click="settype"></u-icon>
			</template>
		</u-input>
		<view style="display: flex;margin-top: 100rpx;" @click="isread=!isread">
			<view
				style="width: 26rpx;height: 26rpx;line-height: 26rpx;text-align: center; border: 2rpx solid #737373;margin:0 12rpx;margin-top: 6rpx;">
				<u-icon color="rgb(40,162,255)" v-if="isread" size="13" name="checkbox-mark"></u-icon>
			</view>
			<view style="flex: 1;color: #010101;font-size: 26rpx;line-height: 40rpx;">
				{{$t('login_readtext')}}<text style="color:rgb(40,162,255)"
					@click.stop="">{{$t('login_terms')}}</text><text
					style="padding: 0 10rpx;">{{$t('login_and')}}</text><text @click.stop=""
					style="color:rgb(40,162,255)">{{$t('login_policy')}}</text>
			</view>
		</view>
		<u-button color="#2A3954" @click="getdata"
			:customStyle="{'height':'82rpx','border-radius':'30rpx','margin-top':'150rpx','font-size':'36rpx'}"
			:text="$t('login_sign')"></u-button>
		<view style="display: flex;margin-top: 55rpx;font-size: 24rpx;color: #2A3954;">
			<view style="flex: 1;text-align: left;">
				<text @click="$u.route('/pages/login/registration')">{{$t('login_registration')}}</text>
			</view>
			<view style="flex: 1;text-align: right;">
				<text @click="$u.route('/pages/login/resetPassword')">{{$t('login_forget')}}</text>
			</view>
		</view>
	</view>

</template>

<script>
	export default {
		data() {
			return {
				passtype: true,
				isread: false,
				query: {
					"Email": "9902041@qq.com",
					"Password": "Top@2022",
					"PushID": "",
					"RegID": "",
					"Language": "",
					"TimeOffset": 8,
					"AppID": "119"
				}
			};
			
		},
		onLoad() {
			// uni.setNavigationBarTitle({
			// 	title: this.$t('login_title')
			// });
		},
		methods: {
			settype() {
				if (this.passtype) {
					this.passtype = false
				} else {
					this.passtype = true
				}
			},
			getdata(){
				if(!this.isread){
					uni.$u.toast(this.$t('login_tip'))
					return;
				}
				this.$store.commit('postdata',{
					url:'/api/Manager/SignIn',
					data:this.query,
					success:(res)=>{
						if(res.Message){
							uni.$u.toast(res.Message);
						}
						if(res.State === 0){
							this.$store.state.$userInfo = res;
							uni.setStorageSync('$userInfo', res);
							setTimeout(()=>{
								// console.log(res)
								uni.$u.route({
									url:'/pages/index/index',
									type:'tab'
								})
							},300)
						}
					},
					error(res){
						// uni.$u.toast('server error');
					}
				})
			}
		}
	}
</script>
<style>
	.u-border-bottom {
		border-color: #2A3954 !important;
		border-width: 1px !important;
	}
</style>
<style lang="scss">

</style>
